﻿

<script>

_run( function() {

    $('.commentCmd').click( function() {
        var form = $('#commentForm');
        $(this).after( form );
        form.show();
        $('textarea[name=content]', form).val('');
        $('input[name=rootId]', form).val( $(this).attr( 'rootId') );
        $('input[name=parentId]', form).val( $(this).attr( 'parentId') );
    });
    
    $('.btnOther').click( function() {
        $('#commentForm').hide();
    });
    
    wojilu.ui.ajaxUpdateForm();
});

</script>

<style type="text/css">
.commentCmd {
/*cursor:pointer; padding:2px 6px 1px 6px; border:1px #ccc outset; background:#efefef; height:18px; text-align:center; */

}
#commentForm table td { padding:5px;}
.commentItem { margin:5px 0px 0px 20px;}
</style>

<div id="commentForm" style="background:#fffbe2;border:1px #fed22f solid; margin:5px;">
<form method="post" action="#{ActionLink}" class="ajaxUpdateForm">
<table style="width:95%;">
    <tr>
        <td style="vertical-align:top; text-align:center;"><img src="#{viewer.PicSmall}" /></td>
        <td>
            <div><textarea name="content" style="width:300px; height:50px;"></textarea><span class="valid" mode="border"></span></div>
            <div style="margin-top:5px;">
            <input type="submit" value="_{comment}" class="btn btns" id="btnComment" /> 
            <input type="button" value="_{cancel}" class="btnOther btns" /></div>
            <input name="rootId" type="hidden" value="#{c.RootId}" />
            <input name="parentId" type="hidden" />
        </td>
    </tr>
</table>
</form>
</div>